<template>
	<view>

		<!-- 使用方法 -->
		<!-- <star-sure :show.sync="sureShow" :title="title" :text="text" @confirm="onConfirm"></star-sure> -->

		<u-popup :show="show" @close="close" @open="open" mode="center" bgColor="transparent">
			<view class="card sure-box">
				<view class="sure-top">
					<view class="sure-tit">{{title}}</view>
					<u-icon name="close" color="#F8FAFC" size="38rpx" @click="close()"></u-icon>
				</view>
				<view class="sure-text">
					{{text}}
				</view>
				<view class="sure-btns">
					<view class="sure-btn1 card" @click="close()">取消</view>
					<view class="sure-btn2" @click="sure()">确认</view>
				</view>
			</view>
		</u-popup>

	</view>
</template>

<script>
	import {productRevoke} from '@/api/market.js'
	export default {
		props: {
			title: {
				type: String,
				default: '暂无标题'
			},
			text: {
				type: String,
				default: '暂无内容'
			},
			show: {
				type: Boolean,
				default: false
			}
		},
		data() {
			return {

			};
		},
		methods: {
			open() {
				this.$emit('update:show', true)
			},
			close() {
				this.$emit('update:show', false)
			},
			sure() {
				this.$emit('confirm');
				this.$emit('update:show', false)
			}
		}
	}
</script>

<style lang="scss">
	.sure-box {
		width: 640rpx;
		height: auto;
		padding: 40rpx 30rpx;

		.sure-top {
			display: flex;
			align-items: center;
			justify-content: space-between;
		}

		.sure-tit {
			font-size: 36rpx;
			font-weight: 600;
			line-height: 1;
			color: #F8FAFC;
		}

		.sure-text {
			font-size: 28rpx;
			color: #94A3B8;
			line-height: 1;
			flex-grow: 1;
			margin-top: 25rpx;
		}

		.sure-btns {
			display: flex;
			gap: 30rpx;
			margin-top: 35rpx;

			.sure-btn1 {
				border-radius: 20rpx;
				flex: 1;
				padding: 20rpx 0;
				display: flex;
				align-items: center;
				justify-content: center;
				background-color: #1e293b;
				color: #e2e8f0;
				font-size: 30rpx;
				font-weight: 30rpx;
			}

			.sure-btn2 {
				border-radius: 20rpx;
				flex: 1;
				padding: 20rpx 0;
				display: flex;
				align-items: center;
				justify-content: center;
				background: linear-gradient(135deg, #ff3e3e, #ff6b6b);
				color: #fff;
				font-size: 30rpx;
				font-weight: 30rpx;
			}
		}
	}
</style>